import * as THREE from 'three';
//导入轨道控制器
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';

import './style.css';

// 声明场景
const scene = new THREE.Scene();

// 声明相机
const camera = new THREE.PerspectiveCamera(
  45,
  window.innerWidth / window.innerHeight,
  0.1,
  500
);

camera.position.set(100, 100, 100);

camera.lookAt(0, 0, 0);

// 声明一个正方体
const wuti = new THREE.BoxGeometry(10, 45, 45);
// 正方体得材质
const caizhi = new THREE.MeshBasicMaterial({
  color: 'red',
});

const wutia = new THREE.Mesh(wuti, caizhi);

scene.add(wutia);
// 声明一个渲染器
const renderer = new THREE.WebGLRenderer();

// 声明渲染画布得大小
renderer.setSize(window.innerWidth, window.innerHeight);

document.body.appendChild(renderer.domElement);

// 轨道查看器
const guidao = new OrbitControls(camera, renderer.domElement);

// 坐标轴
const zhou = new THREE.AxesHelper(100, 100, 100);
scene.add(zhou);
// guidao.enableDamping();
function rato() {
  renderer.render(scene, camera);
  wutia.rotation.y += 0.01;
  wutia.rotation.z += 0.01;
  requestAnimationFrame(rato);
  guidao.update();
}

rato();
